<template>
	<view class="container">
		<view class="search">
			<u-search :showAction="true" actionText="搜索" :animation="false"></u-search>
		</view>
		<view class="all" v-for="(item,index) in serchelist" :key="index"  @tap="toOtherPage">
			<view class="left">
				<text>{{item.left}}</text>
			</view>
			<view class="right">
				<text style="color: #aaa;">{{item.right}}</text>
			</view>
		</view>
		<view class="second" v-for="(item,index) in secondlist" :key="index">
			<view class="s-left">
				<text>{{item.left}}</text>
			</view>
			<view class="s-right">
				<text>{{item.right}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				serchelist:[
					{
					left:'厦门全部景区',
					right:'283个景区>'
				},
				],
				secondlist:[
					{
						left:'厦门鼓浪屿景区',
						right:'名胜古迹'
					},
					{
						left:'厦门嘉庚公园',
						right:'公园'
					},
					{
						left:'厦门中山路步行街',
						right:'动植物园'
					},
					{
						left:'厦门火烧屿',
						right:'自然风光'
					},
					{
						left:'厦门香山公园',
						right:'公园'
					},
					{
						left:'厦门园林植物园',
						right:'名胜古迹'
					},
					{
						left:'厦门方特梦幻王国',
						right:'主题乐园'
					}
				]
			};
		},
		methods:{
			toOtherPage(){
				uni.navigateTo({
					url:"/pages/sousuo/allAttraction"
				})
			}
		}
	}
</script>

<style lang="scss">
.container{
	.second{
		.s-right{
			display: flex;
			justify-content: center;
			align-items: center;
			width: 136rpx;
			background-color: #f7f6fb;
			border: 1px solid black;
		}
		width: 90%;
		margin: auto;
		font-size: 12px;
		margin-top: 30px;
		display: flex;
		justify-content: space-between;
	}
	.all{
		width: 90%;
		margin: auto;
		font-size: 12px;
		margin-top: 20px;
		display: flex;
		justify-content: space-between;
	}
	margin: auto;
	height: 100%;
}
</style>
